Toggle the info pane when clicking the info icon (#587550)

Now clicking on the information icon of the same item a second
time will hide the details pane. Clicking it another time will
show it again, etc.

This is achieved by adding a 'toggle-details' signal which
switches the visibility of the details pane.

Other than the necessary changes, function _selectIndex (in
genericDisplay.js) has been restructured a bit to avoid
duplicating checks.

diff --git a/js/ui/genericDisplay.js b/js/ui/genericDisplay.js
index 7d7533890ba22528075d2ad2e3049df2cd8b5c27..73a6557cd9e03ca2b73f0969ac8f551ca297078e 100644 (file)
--- a/js/ui/genericDisplay.js
+++ b/js/ui/genericDisplay.js
@@ -796,29 +796,39 @@ GenericDisplay.prototype = {
     // Selects (e.g. highlights) a display item at the provided index,
     // updates this.selectedItemDetails actor, and emits 'selected' signal.
     _selectIndex: function(index) {
-        let count = this._list.displayedCount;
+        if (index >= this._list.displayedCount)
+            return
+
+        // If the item is already selected, all we do is toggling the details pane.
+        if (this._selectedIndex == index && index >= 0) {
+            this.emit('toggle-details');
+            return;
+        }
+
+        // Cleanup from the previous item
         if (this._selectedIndex >= 0) {
-            let prev = this._findDisplayedByIndex(this._selectedIndex);
-            prev.markSelected(false);
+            this._findDisplayedByIndex(this._selectedIndex).markSelected(false);
+
             // Calling destroy() gets large image previews released as quickly as
             // possible, if we just removed them, they might hang around for a while
             // until the actor was garbage collected.
             let children = this.selectedItemDetails.get_children();
             for (let i = 0; i < children.length; i++)
                 children[i].destroy();
-    
+
             this.selectedItemDetails.remove_all();
         }
-        if (index < count) {
-            this._selectedIndex = index;
-            if (index >= 0) {
-                let item = this._findDisplayedByIndex(index);
-                item.markSelected(true);
-                this.selectedItemDetails.append(item.createDetailsActor(this._availableWidthForItemDetails,
-                   this._availableHeightForItemDetails), Big.BoxPackFlags.NONE);
-                this.emit('selected');
-            }
-        }
+
+        this._selectedIndex = index;
+        if (index < 0)
+            return
+
+        // Mark the new item as selected and create its details pane
+        let item = this._findDisplayedByIndex(index);
+        item.markSelected(true);
+        this.selectedItemDetails.append(item.createDetailsActor(this._availableWidthForItemDetails,
+            this._availableHeightForItemDetails), Big.BoxPackFlags.NONE);
+        this.emit('selected');
     }
 };
 

diff --git a/js/ui/overlay.js b/js/ui/overlay.js
index eafee2b0d4662b3ea4d0b4c61935a802727befda..2741040c3d0bbe2be9553663909c494bc595eb25 100644 (file)
--- a/js/ui/overlay.js
+++ b/js/ui/overlay.js
@@ -505,6 +505,9 @@ Dash.prototype = {
             this._detailsContent.remove_all();
             this._detailsContent.append(this._docDisplay.selectedItemDetails, Big.BoxPackFlags.NONE);
         }));
+        this._docDisplay.connect('toggle-details', Lang.bind(this, function(docDisplay) {
+            this._toggleDetails();
+        }));
         this._resultsDocsSection.display.connect('selected', Lang.bind(this, function(resultsDocDisplay) {
             this._docDisplay.unsetSelected();
             this._resultsAppsSection.display.unsetSelected();
@@ -512,6 +515,9 @@ Dash.prototype = {
             this._detailsContent.remove_all();
             this._detailsContent.append(this._resultsDocsSection.display.selectedItemDetails, Big.BoxPackFlags.NONE);
         }));
+        this._resultsDocsSection.display.connect('toggle-details', Lang.bind(this, function(resultsDocDisplay) {
+            this._toggleDetails();
+        }));
         this._resultsAppsSection.display.connect('selected', Lang.bind(this, function(resultsAppDisplay) {
             this._docDisplay.unsetSelected();
             this._resultsDocsSection.display.unsetSelected();
@@ -696,6 +702,13 @@ Dash.prototype = {
         this.emit('panes-removed');
      },
 
+    _toggleDetails: function() {
+        if (this._detailsShowing())
+            this._hideDetails();
+        else
+            this._showDetails();
+    },
+
     _detailsShowing: function() {
         return this._detailsPane.visible;
     },